<template>
  <view v-if="questionList.length" class="question-list">
    <view v-for="i of questionList" :key="i.id" class="question-item">
      <view class="question">{{ i.question }}</view>
      <view class="answer" v-html="i.answer"></view>
    </view>
  </view>
  <view v-else class="no-data">暂无问题</view>
</template>

<script setup>
import { ref } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { fetchSecondQuestionList } from '@/api'

const questionList = ref([])

onLoad(e => {
  fetchSecondQuestionList(e?.id).then(res => (questionList.value = res))
})
</script>

<style scoped lang="scss">
.question-list {
  overflow: hidden;
  .question-item {
    margin: 30rpx;
    padding: 30rpx;
    border-radius: 10rpx;
    background-color: #fff;
    .question {
      color: #333;
      font-weight: bold;
      padding-bottom: 30rpx;
    }
    .answer {
      color: #666;
      font-size: 28rpx;
      padding-top: 30rpx;
      border-top: 2rpx solid #efefef;
    }
  }
}
</style>
